import _ from 'lodash';
// import './style.css';
// import saber from './saber.jpg';
import printMe from './print.js';
import { cube } from './math.js';

if (process.env.node_env !== 'production') {
    console.log(process);
    
   console.log('Looks like we are in development mode!');
}


function component() {
  // var element = document.createElement('div');
  var element = document.createElement('pre');
  // var btn = document.createElement('button');
  // Lodash（目前通过一个 script 脚本引入）对于执行这一行是必需的
  // Lodash, now imported by this script
  // element.innerHTML = _.join(['Hello', 'webpack'], ' ');
  // element.classList.add('hello');
  // btn.innerHTML = 'Click me and check the console!';
  // btn.onclick = printMe; 
  // 将图像添加到我们现有的 div。
  //  let myIcon = new Image();
  //  myIcon.src = saber;
  //  element.appendChild(myIcon);
  element.innerHTML = [
         'Hello webpack!',
         '5 cubed is equal to ' + cube(5)
  ].join('\n\n');
  // element.appendChild(btn);
  return element;
}
printMe();
var element = component(); // 当 print.js 改变导致页面重新渲染时，重新获取渲染的元素
document.body.appendChild(element);


// if (module.hot) {
//      module.hot.accept('./print.js', function() {
//      console.log('Accepting the updated printMe module!');
//      document.body.removeChild(element);
//           element = component(); // 重新渲染页面后，component 更新 click 事件处理
//           document.body.appendChild(element);
//      })
//    }